<ui:composition  xmlns="http://www.w3.org/1999/xhtml"
                 xmlns:ui="http://java.sun.com/jsf/facelets"
                 xmlns:h="http://java.sun.com/jsf/html"
                 xmlns:f="http://java.sun.com/jsf/core"
                 xmlns:a4j="http://richfaces.org/a4j"
                 xmlns:rich="http://richfaces.org/rich"
                 xmlns:c="http://java.sun.com/jsp/jstl/core"
                 xmlns:fn="http://java.sun.com/jsp/jstl/functions">
    <h:head>
        <title>中国地震局财务信息服务平台</title>
        <style type="text/css">
            input[type="submit"]{
                margin:5px 10px 5px 10px;
                padding:3px 5px 3px 5px;
            }
        </style>
    </h:head>
    <h:form>
        <rich:panel  header="个人工资台账" styleClass="content-hight">
            请选择年度：
            <h:selectOneMenu value="#{psnSalaBean.wageYear}">
                <f:selectItem itemValue=" " itemLabel="-请选择-"/>
                <f:selectItems value="#{psnSalaBean.psnWageYears}" />
                <a4j:ajax event="change" render="button"/>
            </h:selectOneMenu>
            <a4j:commandButton id="button" value="工资台账" action="#{psnSalaBean.psnYearWage}"
                               disabled="#{empty psnSalaBean.wageYear}" render="ladgerGroup"/>
            <h:commandButton id="ebutton" value="导出Excel" action="#{psnSalaBean.exportExcelAll}"/>
            <h:panelGroup id="ladgerGroup">
                <div style="width:750px;min-height:200px;overflow:auto;">
                    <rich:dataTable id="editTable"
                                    value="#{psnSalaBean.ledger}"
                                    var="explist"
                                    rowKeyVar="rowKey"
                                    style="width: 1500px;" 
                                    styleClass="stable"                                    
                                    noDataLabel="无数据!">
                        <f:facet name="header">
                            <rich:columnGroup>
                                <rich:column colspan="#{fn:length(psnSalaBean.fieldLabels)}">
                                    工资台账(单位/元)
                                </rich:column>
                                <c:forEach items="#{psnSalaBean.fieldLabels}" var="hrow" varStatus="hstatus">    
                                    <c:if test="#{hstatus.index eq 0}">
                                        <rich:column breakRowBefore="true">
                                            <h:outputText value="#{hrow}"/>
                                        </rich:column>
                                    </c:if>
                                    <c:if test="#{hstatus.index gt 0}">
                                        <rich:column>
                                            <h:outputText value="#{hrow}"/>
                                        </rich:column>
                                    </c:if>
                                </c:forEach>
                            </rich:columnGroup>
                        </f:facet>
                        <c:forEach begin="0" end="#{fn:length(psnSalaBean.ledger[0])-1}" step="1" var="col">
                            <c:if test="#{col eq 0}">
                                <rich:column style="text-align: center">
                                    <h:outputText value="#{explist[col]}"/>
                                </rich:column>
                            </c:if>
                            <c:if test="#{col gt 0}">
                                <rich:column style="text-align: right">
                                    <h:outputText value="#{explist[col]}">
                                        <f:convertNumber pattern="#,##0.00" type="number"/>
                                    </h:outputText>
                                </rich:column>
                            </c:if>
                        </c:forEach>
                    </rich:dataTable>
                    <rich:jQuery selector=".stable tr:odd" query="addClass('odd-row')" timing="domready"/>
                    <rich:jQuery selector=".stable tr:even" query="addClass('even-row')"  timing="domready"/>
                    <rich:jQuery selector=".stable tr" event="mouseover" query="jQuery(this).addClass('active-row')" />
                    <rich:jQuery selector=".stable tr" event="mouseout" query="jQuery(this).removeClass('active-row')" />
                    <rich:jQuery selector=".stable tr" event="click" query="jQuery(this).addClass('click-row')"/>
                    <rich:jQuery selector=".stable tr" event="click" query="jQuery('.stable tr').not(this).removeClass('click-row')"/>
                 </div>
            </h:panelGroup>
        </rich:panel>
    </h:form>
</ui:composition>